page{
    font-size: 28px;
    background-color: $page-background-color;

    --nut-primary-color: #1677ff;
    --nut-badge-dot-width : 20px;
    --nut-badge-dot-height : 20px;

    color: $primary-font-color;
  }  

    
    
view, image, navigator, text, textarea, input, checkbox, button{
    box-sizing: border-box;
}

view, navigator, text{
    font-size: 28px;
}

image[mode=widthFix] {
  height: auto;
}

.p-l-r{
    padding-left: $space;
    padding-right: $space;
}

.p-l{
  padding-left: $space;
}
.p-r{
  padding-right: $space;
}

.p-box{
    padding: $space;
}

.m-l-10{
margin-left: 10px;
}
.m-l-20{
margin-left: 20px;
}
.m-l-30{
margin-left: 30px;
}
.m-l-40{
margin-left: 40px;
}

.m-t-5{
  margin-top: 5px;
  }
.m-t-8{
margin-top: 8px;
}

.m-t-10{
margin-top: 10px;
}
.m-t-20{
margin-top: 20px;
}
.m-t-30{
margin-top: 30px;
}
.m-t-40{
margin-top: 40px;
}
.m-t-60{
margin-top: 60px;
}


.f-28{
  font-size: 28px;
}

.f-24{
  font-size: 24px;
}
.f-32{
  font-size: 32px;
}
.f-36{
  font-size: 36px;
}

.color-fff{color: #fff;}
.color-999{color: #999;}
.color-primary{color: $primary-color;}

.text-center{text-align: center;}

.flex-align-items-center{
    display: flex;
    align-items: center;
}

.nut-badge__content--sup{
  background: #FE3F40 !important;
}